.analysis {
  width: 100%;

  >header {
    width: 100%;
    background-color: var(--bgfff);
    // height: 178px;

    >div {
      width: var(--pagewidth);
      margin: 0 auto;
      padding-top: 40px;
      display: flex;
      justify-content: flex-start;
      flex-direction: column;
      align-items: center;

      >p {
        font-size: 14px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: var(--font999);
        line-height: 20px;

        >span {
          &:first-child {
            margin-right: 20px;
          }
        }
      }

      >section {
        display: flex;
        align-items: center;
        font-size: 20px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: var(--font333);
        width: 100%;

        h3 {
          margin: 0;
          flex: 1;
          text-align: right;
          // white-space: nowrap;
        }

        >div {
          display: flex;
          align-items: center;
          flex: 1;
        }

        >span {
          // margin: 0 111px;
          width: 222px;
          display: inline-block;
          text-align: center;
          flex-shrink: 0;
        }

        img {
          width: 60px;
          margin: 0 20px;
        }
      }

      >h4 {
        margin-top: 15px;
        margin-bottom: 40px;
      }
    }

    >nav {

      width: 100%;

      align-items: center;
      border-top: 1px solid #E1E1E1;
      border-bottom: 1px solid #E1E1E1;
      margin: 0 auto;

      >div {
        width: var(--pagewidth);
        margin: 0 auto;
        padding-left: 42px;
        height: 64px;
        display: flex;

        >span {
          font-size: 18px;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: var(--font333);
          margin-right: 60px;
          position: relative;
          height: 100%;
          line-height: 64px;
          cursor: pointer;

          &.active {
            &::after {
              position: absolute;
              left: 50%;
              width: 31px;
              height: 4px;
              transform: translateX(-50%);
              content: '';
              bottom: 0;
              background-color: var(--theme);
            }
          }
        }
      }


    }
  }

  >section {

    width: var(--pagewidth);
    margin: 0 auto;

    >aside {
      >p {
        font-size: 18px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: var(--font333);
        line-height: 25px;
        margin: 25px auto;
        text-align: center;
      }

      >section {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;

        >aside {
          width: 590px;
          background-color: var(--bgfff);
          overflow: auto;
          max-height: 370px;

          &::-webkit-scrollbar {
            width: 4px;
            background-color: var(--bgfff);
          }

          // 滚动条轨道
          &::-webkit-scrollbar-track {
            width: 40px;
            border-radius: 40px;
            background-color: var(--bgfff);
          }

          // 滚动条滑块
          &::-webkit-scrollbar-thumb {
            border: 5px solid var(--theme);
            border-radius: 40px;
          }


          >header {
            display: flex;
            padding: 15px;
            align-items: center;
            position: sticky;
            background: var(--bgfff);
            left: 0;
            /* 首行在左 */
            top: 0;
            z-index: 1;

            :global(.ant-select-selector) {
              border-radius: 15px !important;
            }

            >img {
              width: 30px;
              margin-right: 10px;
            }

            >span {
              font-size: 16px;
              font-family: PingFangSC-Medium, PingFang SC;
              font-weight: 500;
              color: var(--font333);
              margin-right: 20px;
            }
          }

          >table {
            width: 100%;
            background: var(--bgfff);
            border-radius: 8px;
            // table-layout: fixed;
            position: relative;

            .header {
              background: var(--bgfff) !important;
            }

            >tr {
              &:first-child {
                position: sticky;
                left: 0;
                /* 首行在左 */
                top: 62px;
                z-index: 1;
              }

              &:nth-child(2n) {
                background: var(--bgcolor);
              }
            }

            th {
              font-size: 14px;
              font-family: PingFangSC-Regular, PingFang SC;
              font-weight: 400;
              color: var(--font999);
              height: 50px;
            }

            td {
              text-align: center;
              font-size: 14px;
              font-family: PingFangSC-Medium, PingFang SC;
              font-weight: 500;
              color: var(--font333);
              height: 50px;
            }



            &.history {
              >tr {

                >th,
                >td {
                  &:nth-child(3) {
                    border-left: 1px solid #E1E1E1;
                    border-right: 1px solid #E1E1E1;
                  }
                }

              }

              .center {
                display: flex;
                align-items: center;

                >span {
                  flex: 1;
                }
              }
            }
          }
        }
      }

      .rankingBasketball {
        width: 100%;
        background: var(--bgfff);
        box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.13);
        border-radius: 8px;
        border-collapse: collapse;

        >tr {
          height: 50px;

          &:first-child {
            background: #FAFAFA;
            border-radius: 8px 8px 0px 0px;

            >td {
              font-size: 14px;
              font-family: PingFangSC-Medium, PingFang SC;
              font-weight: 500;
              color: var(--font999);
            }
          }

          >td {
            text-align: center;
            font-size: 14px;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: var(--font333);
          }
        }
      }
    }
  }
}


.indexSum {
  width: var(--pagewidth);
  margin: 28px auto !important;

  table {
    width: 100%;
    background: var(--bgfff);
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.13);
    border-radius: 8px;

    td,
    th {
      text-align: center;
      height: 50px;
    }

    &.type1 {

      td,
      th {

        &:first-child,
        &:nth-child(4),
        &:nth-child(8) {
          border-right: 1px solid #E1E1E1;
        }
      }

    }

    &.type2 {

      td,
      th {

        &:first-child,
        &:nth-child(3),
        &:nth-child(6) {
          border-right: 1px solid #E1E1E1;
        }
      }
    }

    th {
      font-size: 16px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: var(--font333);
    }

    tr {
      &:first-child {
        height: 50px;
        background: #FAFAFA;
        border-radius: 8px 8px 0px 0px;
      }

      border-collapse: collapse;

      border-bottom: 1px solid #E1E1E1;
    }
  }
}


.footer {
  margin: 0 auto;
  width: var(--pagewidth);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  background-color: var(--bgfff);
  margin-top: 20px;

  >p {
    margin: 0;
    font-size: 18px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: var(--font333);
    line-height: 25px;

    &:last-child {
      text-align: justify;
      text-align-last: left;
      margin-top: 20px;
    }
  }

  padding: 20px 70px 50px;
}